<template>
	<view>
		<!-- 导航 -->
		<view class="banner-box">
			<view class="menu-list-box">
				<view v-for="(i,index) in menu" :key="index" :class="index==current1?'active':''" class="item">
					<view class="sanjiao" v-if="i.children"></view>
					<view class="daohang-title" @click="home(i.name)">

						<text>{{i.name}}</text>
						<view class="iconfont dingwei" v-if="i.children">&#xe638;</view>
					</view>


					<view class="caidan" v-if="i.children">
						<view v-for="(m,index1) in i.childrenMenu" :key="index1" :class="index==current1?index1==current2?'active':'':''"
						 @click.stop="menuBtn(index,index1,m.link)">{{m.name}}</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				current1: 0,
				current2: 0,
				menu: [{
						name: '首页',
						children: false,
						link: 'home',
						childrenMenu: [{
							name: '子菜单1',
							link: 'zicaidan1'
						}]
					},
					/* {
						name: '私立中学',
						children: true,
						link: 'yemian1',
						childrenMenu: [{
								name: '牛津德欧中学',
								link: '/pages/dvb/dvb'
							},
							{
								name: '牛津国际高中',
								link: '/pages/oic/oic'
							},
							{
								name: '牛津学院',
								link: '/pages/oxsfc/oxsfc'
							}
						]
					}, */
					{
						name: '合作大学',
						children: true,
						link: 'yemian2',
						childrenMenu: [{
								name: '班戈大学',
								link: '/pages/bangor/bangor'
							},
							{
								name: '邓迪大学',
								link: '/pages/dundee/dundee'
							},
							{
								name: '德蒙福特大学',
								link: '/pages/montfort/montfort'
							},
							{
								name: '格林威治大学',
								link: '/pages/greenwich/greenwich'
							},
							{
								name: '雅各布大学',
								link: '/pages/Jacobs/Jacobs'
							},
							{
								name: '布拉德福德大学',
								link: '/pages/bradford/bradford'
							},
							{
								name: '在线英语先修课程',
								link: '/pages/online-pre-sessional-english-course/online-pre-sessional-english-course'
							},
							/*{
							  name:'与学生大使交流',
							  link:'/yemian2/zicaidan3-3'
							},*/
							{
								name: '申请',
								link: '/pages/application/application'
							}
						]
					},
					{
						name: '关于我们',
						children: true,
						link: 'yemian1',
						childrenMenu: [
							/*{
							  name:'介绍',
							  link:'agents'
							},*/
							{
								name: '核心价值观',
								link: '/pages/corevalue/corevalue'
							},
							{
								name: '隐私条款',
								link: '/pages/policy/policy'
							}
						]
					},
					{
						name: '代理服务',
						children: true,
						link: 'yemian1',
						childrenMenu: [{
								name: '介绍',
								link: '/pages/agents/agents'
							},
							{
								name: '资料下载',
								link: '/pages/download/download'
							},
							/*{
							  name:'联系合作',
							  link:'pwu'
							}*/
						]
					},
				]
			}
		},
		created() {
			console.log('this.current1',this.current1)
			let aa = uni.getStorageSync('a1')
			if (aa!=0) {
				this.current1 = uni.getStorageSync('a1')
				this.current2 = uni.getStorageSync('a2')
			} else{
				this.current1 = 0
				this.current2 = 0
			}
		},
		methods: {
			home(txt) {
				console.log(txt)
				if (txt == '首页') {
					this.current1 = 0
					this.current2 = 0
					uni.setStorageSync('a1',0)
					uni.setStorageSync('a2',0)
					console.log(this.current1)
					console.log(this.current2)
					uni.redirectTo({
						url: '/pages/index/index'
					})
					
					
				}
			},
			menuBtn(a1, a2, link) {
				this.current1 = a1
				this.current2 = a2
				uni.setStorageSync('a1',a1)
				uni.setStorageSync('a2',a2)
				uni.redirectTo({
					url: link
				})
			},
		}
	}
</script>

<style lang="scss">
	.iconfont {
		font-family: "iconfont" !important;
		font-size: 28px;
		font-style: normal;
		-webkit-font-smoothing: antialiased;
		-webkit-text-stroke-width: 0.2px;
		-moz-osx-font-smoothing: grayscale;
	}

	.banner-box {
		max-width: 1200px;
		margin: 0 auto;

	}

	.menu-list-box {
		display: flex;
		flex-direction: row;

		align-items: center;
	}

	.item {
		height: 56px;
		position: relative;
		padding: 0 25px;
	}

	.item:hover {
		background: #3281c4;

		.sanjiao {
			display: block
		}

		.caidan {
			display: block;

		}

		.daohang-title {
			color: #fff;
		}
	}

	.caidan {
		position: absolute;
		padding-top: 20px;
		width: 150px;
		left: 0;
		top: 100%;
		display: none;
		background: #fff;
		font-size: 13px;
		view {
			cursor: pointer;
			line-height: 30px;
			padding-left: 10px;
		}

		view:hover {
			background: #3281c4;
			color: #fff;
		}
	}

	.sanjiao {
		position: absolute;
		display: none;
		content: '';
		width: 20px;
		height: 20px;
		background: #3281c4;
		transform: rotate(45deg);
		bottom: -10px;
		left: 50%;
		margin-left: -10px;
		z-index: 99;
	}

	.daohang-title {
		display: flex;
		flex-direction: row;
		height: 100%;
		align-items: center;
	}

	.active {
		background: #ccc;
	}
	@media screen and ( max-width: 750px ) {
		.menu-list-box{
			display: none;
		}
	}
</style>
